<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>register</title>
		<link rel="stylesheet" type="text/css" href="style/register.css"/>
		<script src="js/jquery.min.js" type="text/javascript" charset="utf-8"></script>
	</head>
	<body>
		<div id="register" class="margin">
			<div class="box">
				<div class="one">
					<span class="log">注册蜜芽</span>
					<span class="lno">
						<i>已有蜜芽账号</i>
						<a href="login.html">登录</a>
					</span>
				</div>
				<div class="two">
					<div class="phone">
						<div class="inp">
							<div class="icon"></div>
							<input type="text" placeholder="手机号" />
						</div>
						<div class="warm">请输入正确的手机号码，且为11位纯数字格式</div>
					</div>
					
					<div class="confirm pass">
						<a class="inp">
							<div class="icon1"></div>
							<span>点击完成验证</span>
						</a>
					</div>
					
					<div class="mess">
						<div class="inp">
							<input type="text" placeholder="短信验证码" />
						</div>
						<a href="javascript:;">获取短信验证码</a>
						<div class="warm">验证码输入有误</div>
					</div>
					
					<div class="pass">
						<div class="inp pas">
							<div class="icon1"></div>
							<input type="password" placeholder="密码" class="pass1" />
						</div>
						<p class="notice not1">
							<span>长度为6-14个字符，建议使用字母加数字或符号组合</span>
							<span class="ximg"><img src="images/t19.png" /></span>
						</p>
					</div>
					<div class="pass">
						<div class="inp pas">
							<div class="icon1"></div>
							<input type="password" placeholder="确认密码" class="pass2" />
						</div>
						<p class="notice not2">
							<span class="cont">长度为6-14个字符，建议使用字母加数字或符号组合</span>
							<span class="ximg"><img src="images/t19.png" /></span>
						</p>
					</div>
					
					<div class="pass checks">
						<input type="checkbox" checked="checked" />
						<span class="txt">我已阅读并接受</span>
						<a href="javascript:;">《蜜芽服务条款》</a>
						<p>
							<span>您未阅读并接受蜜芽服务条款</span>
							<span class="ximg"><img src="images/t19.png" /></span>
						</p>
					</div>
					
					<div class="btn">
						<a href="javascript:;" class="regbtn">注册</a>
					</div>
				</div>
				
			</div>
			<img src="images/ewm.png" class="ewm" />
		</div>
		<div class="text">Copyright ©2017 北京花旺在线商贸有限公司 Miyabaobei.com 保留一切权利。客服热线： 400-789-2000。京ICP证140430号 京ICP备14006215号</div>
		
		<script type="text/javascript">
			function random(min,max){    //随机数
				return parseInt(Math.random()*(max-min+1)+min);
			}
			
			$(function(){
				var $phone=$('#register .two .phone input');  //手机号输入
				var $mesg=$('#register .mess .inp input');  //短信验证码
				var $getbtn=$('#register .two .mess a');  //短信验证码按钮
				var $warm1=$('#register .phone .warm');  //手机提示
				var $warm2=$('#register .mess .warm');  //短信提示
				var $pass1=$('#register .pass .pass1');  //密码
				var $pass2=$('#register .pass .pass2');  //确认密码
				var $not1=$('#register .pass .not1');  //密码提示
				var $not2=$('#register .pass .not2');  //确认密码提示
				var $cont=$('#register .pass .cont');  //确认密码提示内容
				var $regbtn=$('#register .btn .regbtn');  //注册
				//验证手机号
				var str=0;
				var reg=/^1[3|5|7]\d{9}$/;   //手机号
				var bstop=true;//不通过
				$phone.on('blur',function(){   
					str=$phone.val();
					$warm1.css('display','none');
					if(str!=''){
						if(reg.test(str)){
//							$warm1.css('display','none');
							$.ajax({
								type:'post',
								url:'php/reg.php',
								data:{
									str:str   //第一个str与php中的str对应，第二个str为上面的值
								},
								success:function(data){
									if(!data){
										$warm1.css('display','none');
										bstop=false;
									}else{
										$warm1.css('display','block');
										$warm1.html('该用户已存在');
										bstop=true;
									}
								}
							});
						}else{
							$warm1.css('display','block');
							$warm1.text('请输入正确的手机号码，且为11位纯数字格式');
							bstop=true;
						}
					}else{
						$warm1.css('display','block');
						$warm1.text('请输入正确的手机号码，且为11位纯数字格式');
						bstop=true;
					}
				});
				//获取短信验证码
				$getbtn.on('click',function(){
					var str1='';
					for(var i=1;i<=4;i++){
						str1+=random(0,9);
					}
					$mesg.val(str1);
					$warm2.css('display','none');
				});
				//密码
				var reg1=/^.{6,14}$/;  //密码：长度为6-14个字符，建议使用字母加数字或符号组合
				var str2='';
				var bstop1=true;
				$pass1.on('blur',function(){
					str2=$pass1.val();
					if(str2!=''){
						if(reg1.test(str2)){
							$not1.css('display','none');
							bstop1=false;
						}else{
							$not1.css('display','block');
							bstop1=true;
						}
					}
				});
				
				//确认密码
				var str3='';
				$pass2.on('blur',function(){
					str3=$pass2.val();
					$not2.css('display','none');
					if(str3!=''){
						if(str3!=$pass1.val()){
							$not2.css('display','block');
							$cont.text('两次输入的密码不一致');
						}
					}
				});
				
				
				//点击注册按钮
				var all='';  //要传入php进行判断
				$regbtn.on('click',function(){
					if(bstop==true && $mesg.val()=='' && bstop1==true && $pass2.val()!=$pass1.val()){
						return false;
					}else{
						var phone=$phone.val();
						var pass=$pass1.val();
//						alert(phone+'，'+pass);
						$.ajax({
							type:"post",
							url:"php/reg.php",
							data:{
								phone:phone,
								pass:pass,
								all:''
							},
							success:function(data){
								location.href='login.html';
							}
						});
					}
					
					/*if(!reg.test(str)){  //验证手机号
						if($mesg.val()==''){  //验证验证码
							$warm2.css('display','block');
							if(!reg1.test(str2)){
								$not1.css('display','block');
							}else{
								if($pass2.val()!=$pass1.val()){
									$not2.css('display','block');
								}
							}
						}else{  //短信验证不为空
							if(!reg1.test(str2)){
								$not1.css('display','block');
							}else{
								if($pass2.val()!=$pass1.val()){
									$not2.css('display','block');
								}
							}
						}
						$warm1.css('display','block');
					}else{
						if($mesg.val()==''){
							$warm2.css('display','block');
							if(!reg1.test(str2)){
								$not1.css('display','block');
							}else{
								if($pass2.val()!=$pass1.val()){
									$not2.css('display','block');
								}
							}
						}else{
							if(!reg1.test(str2)){  //密码不正确
								$not1.css('display','block');
							}else{
								if($pass2.val()!=$pass1.val()){
									$not2.css('display','block');
								}else{
									location.href='login.html';
								}
							}
							
						}
					}*/
				
				});
			});
		</script>
		
	</body>
</html>
